package myJs.user.workflow.featureSelection

import japgolly.scalajs.react.facade.SyntheticDragEvent
import myJs.Implicits._
import myJs.api.Api
import myJs.cps.BootstrapTableCp._
import myJs.cps._
import myJs.myPkg.topology._
import myJs.tool.Pojo._
import myJs.tool.Tool
import myJs.tool.Tool.messages
import myJs.user.workflow.featureSelection.cor.Cor
import myJs.user.workflow.featureSelection.diagnoseAna.DiagnoseAna
import myJs.user.workflow.featureSelection.intersect.Intersect
import myJs.user.workflow.featureSelection.pathwayAna.PathwayAna
import myJs.user.workflow.featureSelection.pca.Pca
import myJs.user.workflow.featureSelection.uniAna._
import org.scalajs.dom.html
import org.scalajs.macrotaskexecutor.MacrotaskExecutor.Implicits._
import shared.Pojo.GroupDataKind
import shared.pojo.Pojo.groupFileData._
import upickle.default._

import scala.collection.immutable.SeqMap
import scala.scalajs.js.Dynamic.{global => g}
import scala.scalajs.js.JSON

import japgolly.scalajs.react.vdom.all._
import japgolly.scalajs.react._
import japgolly.scalajs.react.React.Fragment
import japgolly.scalajs.react.util.EffectCatsEffect._
import myJs.myPkg.Hooks._
import cats.effect._
import myJs.Implicits._
import myJs.Utils._

/** Created by yz on 21/1/2022
  */
object LeftModulesCp {

  lazy val moduleMap = SeqMap(
    "uniAna" -> messages("uniAna"),
    "oplsda" -> messages("oplsda"),
    "plsda" -> messages("plsda"),
    "rf" -> messages("randomForest"),
    "svm" -> messages("svmAna"),
    "boruta" -> messages("borutaAna"),
    "cor" -> messages("cor"),
    "intersect" -> messages("intersect"),
    "union" -> messages("getUnion"),
    "pathwayAna" -> messages("pathwayAna"),
    "diagnoseAna" -> messages("diagnoseAna"),
    "pca" -> messages("pca")
  )

  case class Props(topology: Topology, draggable: Boolean = false) {
    @inline def render: VdomElement = {
      Component(this)
    }
  }

  val Component = ScalaFnComponent[Props] { props =>
    object FTool {

      def dragStart(kind: String, text: String)(e: ReactEventFromHtml) = SyncIO {
        val ev = e.asInstanceOf[SyntheticDragEvent[html.LI]]
        val nodes = props.topology.data.pens.filter { pen =>
          pen.`type` == PenType.Node && pen.id.startsWith(kind)
        }
        val id = if (nodes.isEmpty) {
          0
        } else {
          val curIds = nodes.map { node =>
            node.id.replaceAll(s"${kind}" + "_", "").toInt
          }.toList
          curIds.max + 1
        }
        val idSuffix = if (id == 0) "" else s"_${id}"
        val onlyUpKinds = List(PathwayAna.nameStr, DiagnoseAna.nameStr, Pca.nameStr)
        val anchorType = if (onlyUpKinds.contains(kind)) {
          AnchorType.OnlyUp
        } else AnchorType.UpAndBottom
        val height = if (Tool.isEn) {
          kind match {
            case UniAna.nameStr => 40
            case Cor.nameStr => 50
            case Intersect.nameStr => 40
            case PathwayAna.nameStr => 40
            case DiagnoseAna.nameStr => 40
            case _ => 30
          }
        } else 30
        val radiusKinds = List(PathwayAna, DiagnoseAna, Pca).map(_.nameStr)
        val borderRadius = if (radiusKinds.contains(kind)) 0.8 else 0.1
        val node = TopologyNode(
          id = s"${kind}_${id}",
          name = "rectangle",
          borderRadius = borderRadius,
          paddingBottom = 10,
          paddingTop = 10,
          paddingLeft = 10,
          paddingRight = 10,
          text = s"${text}${idSuffix}",
          rect = Rect(
            width = 100,
            height = height
          ),
          anchorType = anchorType
        )
        ev.dataTransfer.setData("Topology", JSON.stringify(node))
      }

    }

    div(
      className := "dd",
      ol(
        className := "dd-list",
        moduleMap.zipWithIndex.toVdomArray { case ((dataKind, showText), curI) =>
          li(
            key := s"${curI}",
            className := "dd-item",
            onDragStart ==> FTool.dragStart(dataKind, showText),
            div(
              className := "dd-handle myModule",
              VdomAttr("data-kind") := s"${dataKind}",
              draggable := props.draggable,
              s"${showText}"
            )
          )
        }
      )
    )

  }

}
